<template>
<div id="tab-bar">
  <mt-tabbar v-model="selected" v-show="isShow" fixed class="border-1px-top">
    <mt-tab-item id="main">
      <img :src="img1" slot="icon">首页
    </mt-tab-item>
    <mt-tab-item id="tool">
      <img :src="img3" slot="icon">应用中心
    </mt-tab-item>
    <mt-tab-item id="my">
      <img :src="img5" slot="icon">我的
    </mt-tab-item>
  </mt-tabbar>
</div>
</template>

<script>
export default {
  name: "FooterBar",
  data(){
    return{
      selected:'main',
      img1: 'src/assets/logo.png',
      img3: 'src/assets/logo.png',
      img5: 'src/assets/logo.png'
    }
  },
  computed:{
      isShow:function (){
        return true;
      }
  },
  watch:{
    'selected':{
      handler(){
        if (this.selected == 'main'){
          this.$router.push('/main')
        }
        if (this.selected == 'tool'){
          this.$router.push('/tool')
        }
        if (this.selected == 'my'){
          this.$router.push('/my')
        }
      }
    }
  }
}
</script>

<style scoped>

</style>
